<template>
    <div class="login-wrap df jcc aic">
        <van-form @submit="onSubmit">
            <van-field v-model="account" name="account"  placeholder="用户名"
                :rules="[{ required: true, message: '请填写用户名' }]" />
            <van-field v-model="password" type="password" name="password"  placeholder="密码"
                :rules="[{ required: true, message: '请填写密码' }]" />
            <div style="margin: 16px;">
                <van-button round block type="info" native-type="submit">登录</van-button>
            </div>
        </van-form>
    </div>
</template>

<script>
import { mapActions } from 'vuex';

export default {
    data() {
        return {
            account: '',
            password: '',
        };
    },
    methods: {
        ...mapActions('user', ['getLogin']),
        async onSubmit(values) {
            await this.getLogin(values)
            this.$router.push('/home')
        },
    },
};
</script>

<style lang="scss" scoped>
.van-form{
    width: 80% !important;
}
.login-wrap {
    height: 100%;
    background: url("@/assets/img/ds..webp");
    background-size: cover;

    .van-form {
        height: 180px;
    }
}
</style>